<?php
header("content-type:text/html;charset=utf-8");
$sdn=("mysql:host=127.0.0.1;dbname=myexam;charset=utf8");
$pdo=new PDO($sdn,'root','root');
$sql="select * from pro";
$res=$pdo->query($sql);
$data=$res->fetchAll(PDO::FETCH_ASSOC);
?>

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
<div>倒计时：<span id="hour">时</span><span id="min">分</span><span id="sec">秒</span></div>
        <center>
            <table border="1">
                <tr>
                    <td>ID</td>
                    <td>商品名称</td>
                    <td>数量</td>
                    <td>原价</td>
                    <td>惊爆价</td>
                    <td>操作</td>
                </tr>
                <?php foreach ($data as $key=>$val):?>
                    <tr>
                        <td><?=$val['id']?></td>
                        <td><?=$val['name']?></td>
                        <td><?=$val['shu']?></td>
                        <td><?=$val['price']?></td>
                        <td><?=$val['qprice']?></td>
                        <td><input type="button" value="抢购" id="sub" data-id="<?=$val['id']?>"></td>
                    </tr>
                <?php endforeach?>
            </table>
        </center>
</body>
</html>
<script src="jquery-3.3.1.min.js"></script>
<script>s
    window.setInterval(function(){
       $.getJSON('time.php',"",function(e){
           $("#hour").html(e.hour+"时");
           $("#min").html(e.min+"分");
           $("#sec").html(e.sec+"秒");
       },) ;
    },1000);

    $("#sub").click(function(){
        var id=$(this).attr("data-id");
        $.ajax({
            url:"miao.php",
            data:{id:id},
            dataType:'json',
            type:'post',
            success:function(res)
            {
                if(res.msa)
                {
                    alert(res.msa);
                    location.reload();
                }

            }
        })
    });
</script>











